<div class="table-responsive">
    <table class="table table-striped ">
        <thead class="w-100">
        <tr class="row mx-0">
            <th class="col-3">规则id</th>
            <th class="col-3">内容</th>
            <th class="col-3">标题</th>
            <th class="col-3">源网址</th>
          <!--  <th class="col-4">数据（JSON）</th>-->
        </tr>
        </thead>
        <tbody class="w-100">
        <tr ng-repeat="pageContent in pageContents" class="row mx-0">
            <td class="col-3">{{pageContent.ruleId}}</td>
            <td class="col-3">
                <a ng-click="editorContent(pageContent)" data-toggle="modal" style="color: #1e88e5"
                   data-target="#editorModel">
                    {{pageContent.content.length>40?pageContent.content.substring(0,40)+'...':pageContent.content}}</a>

                <!-- {{pageContent.content}}-->

            </td>
            <td class="col-3">
                <a ng-click="editorTitle(pageContent)" data-toggle="modal" style="color: #1e88e5"
                   data-target="#editorModel">
                    {{pageContent.title.length>30?pageContent.title.substring(0,30)+'...':pageContent.title}}</a>
                <!--   {{pageContent.title}}-->
            </td>

            <td class="col-3">

                <a href="{{pageContent.sourceUrl}}" target="_blank" title="{{pageContent.sourceUrl}}">{{pageContent.sourceUrl.length>30?pageContent.sourceUrl.substring(0,30)+'...':pageContent.sourceUrl}}</a>

            </td>
<!--
            <td class="col-4">
                &lt;!&ndash;    {{pageContent.dataItem.length>50?pageContent.dataItem.substring(0,50)+'...':pageContent.dataItem}}
                    <button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover" data-placement="bottom" data-content="{{pageContent.dataItem}}">

                    </button>&ndash;&gt;
                <a ng-click="editorData(pageContent)" data-toggle="modal" style="color: #1e88e5"
                   data-target="#editorModel">
            {{pageContent.dataItem.length>50?pageContent.dataItem.substring(0,50)+'...':pageContent.dataItem}}</a>
            </td>-->

        </tr>
        </tbody>
    </table>
</div>


<div id="editorModel" class="modal fade " tabindex="-1" role="dialog"
     aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog " style="margin: 10.75rem auto">
        <div class="modal-content" style="width: 168%">
            <div class="modal-header">
                <h5 class="modal-title">结果查看</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
          <!--  <div id="editor"  ng-model="pageContentEditor"></div>-->
            <div id="editor"></div>
        </div>
    </div>
</div>

<nav aria-label="Page navigation example">
    <ul class="pagination">
        <span>共{{totalPage}}页,共{{totalCount}}条，当前第{{page+1}}页</span>
        &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
        <li class="page-item">
            <a class="page-link" ng-click="Previous(page)" aria-label="Previous">
                <span aria-hidden="true">上一页</span>
                <!--     <span class="sr-only">Previous</span>-->
            </a>
        </li>

        <li class="page-item">
            <a class="page-link" ng-click="Next(page)" aria-label="Next">
                <span aria-hidden="true">下一页</span>
                <!--     <span class="sr-only">Next</span>-->
            </a>
        </li>
        &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
        <input type="text" ng-model="number" style="width: 40px"/>
        <div>
            <button class="btn-primary" ng-click="goto(number)" style="height: 100%">转到</button>
        </div>
    </ul>
</nav>